<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="Assign_Roles.aspx.cs" Inherits="Dashboard.admin.access.Assign_Roles" %>

<%@ Register assembly="GrayParrot.Web.Controls" namespace="GrayParrot.Web.Controls" tagprefix="cc1" %>


<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
  <style>
      #sortable1, #sortable2 {
        border: 1px solid #eee;
        width: 142px;
        min-height: 20px;
        list-style-type: none;
        margin: 0;
        padding: 5px 0 0 0;
        float: left;
        margin-right: 10px;
      }
      #sortable1 li, #sortable2 li {
        margin: 0 5px 5px 5px;
        padding: 5px;
        font-size: 1.2em;
        width: auto;
      }
  </style>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

    <section class="panel">
	        <header class="panel-heading">
				<h2>Assegnazione Funzionalit&agrave; - Ruoli</h2><h3 id="pageName" class="panel-title" style="display:none" >pp</h3>
			</header>
			<div class="panel-tools" align="right">
				<ul class="tooltip-area">
					<li><a href="javascript:void(0)" class="btn btn-collapse" title="Collapse"><i class="fa fa-sort-amount-asc"></i></a></li>
					<li><a href="javascript:void(0)" class="btn btn-reload"  title="Reload"><i class="fa fa-retweet"></i></a></li>
					<li><a href="javascript:void(0)" class="btn btn-close" title="Close"><i class="fa fa-times"></i></a></li>
				</ul>
			</div>
			<div class="panel-body">

                <!-- PUT YOUR CONTENT HERE -->
				<div class="row">
						<div class="col-sm-4">
                            <div class="panel-body">
                                <h3>Pagine</h3>
								<hr/>
                                <cc1:MenuBuilder runat="server" ID="MenuBuilder1" SiteMapDataSourceID="SiteMapDataSource1" AssignRoles="true" />
                            </div>  
						</div>
						<!-- //content > row > col-sm-9 -->
						<div class="col-sm-4">
								<h3>Ruoli disponibili</h3>
								<hr />
                                <ul id="sortable1" class="list-group border-bottom connectedSortable"></ul>
						</div>								
						<div class="col-sm-4">
								<h3>Ruoli assegnati</h3>
								<hr/>
                                <ul id="sortable2" class="list-group border-bottom connectedSortable"></ul>
						</div>
						<!-- //content > row > col-lg-3 -->
				</div>
			</div>
			<footer class="panel-footer">
<%--				<button type="submit" class="btn" data-color="#F4AD41">Submit</button>
				<button type="reset" class="btn">Cancel</button>--%>

                <button class="btn btn-default btn-lg" data-color="#F4AD41" type="button" onclick="javascript:Save()">Salva configurazione</button>
                <button class="btn btn-default btn-lg" type="button" onclick="javascript:Reset()">Resetta</button>
                <button class="btn btn-default btn-lg" type="button" onclick="javascript:Annulla()">Annulla</button>
			</footer>
	</section>       


</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="LocaJavascript" runat="server">
    <script type="text/javascript">
        var m_selectedId = null;
        var m_selectedPage = null;

        $( document ).ready(function() {
            $("li:contains('Assegnazione Ruoli')").addClass("active");

            $("#sortable1, #sortable2").sortable({
                connectWith: ".connectedSortable"
            }).disableSelection();
        });

        function LoadAssignableRoles(pageId) {

            $("#sortable1").empty();

            var m_data = JSON.stringify({ PageId: pageId })

            $.ajax({
                type: "POST",
                url: '/api/authentication/LoadAssignableRoles',
                data: m_data,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var data = JSON.parse(response);

                    if (data) {
                        $.each(data, function (index, value) {
                            $("#sortable1").append("<li class=\"list-group-item\">" + value + "</li>");
                        });
                    }
                },
                failure: function (response) {
                    alert(response.d);
                }
            });
        }

        function LoadPageRoles(pageId) {

            $("#sortable2").empty();

            var m_data = JSON.stringify({ PageId: pageId })

            $.ajax({
                type: "POST",
                url: '/api/authentication/LoadPageRoles',
                data: m_data,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var data = JSON.parse(response);

                    if (data) {
                        $.each(data, function (index, value) {
                            $("#sortable2").append("<li class=\"list-group-item\">" + value + "</li>");
                        });
                    }
                },
                failure: function (response) {
                    alert(response.d);
                }
            });
        }

        function AssignRole(page, id) {
            if (id != '') {
                //alert(page, id);

                $('#pageName').html('(hai selezionato: ' + page + ')').show();

                m_selectedId = id;
                m_selectedPage = page;

                LoadAssignableRoles(m_selectedId);

                LoadPageRoles(m_selectedId);
            }
        }

        function Annulla() {
            $('#pageName').hide();

            LoadAssignableRoles(m_selectedId);

            LoadPageRoles(m_selectedId);

            m_selectedId = null;
        }

        function Reset() {

            if (m_selectedId == null) {
                alert('Selezionare la pagina per la quale cancellare l\'assegnazione dei permessi !');
                return;
            }

            var data = JSON.stringify({ PageId: m_selectedId })

            $.ajax({
                type: "POST",
                url: '/api/authentication/DeleteAllAssignedRoles',
                data: data,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var data = JSON.parse(response);

                    if (data.d) {
                        alert(data.msg);
                    } else {
                        alert(data.msg);
                    }
                },
                failure: function (response) {
                    alert(response.message);
                }
            });

        }

        function Save() {

            if (m_selectedId == null) {
                alert('Selezionare la pagina cui assegnare i permessi !');
                return;
            }

            var m_pages = [];

            if ($('ul > li').size() > 0) {
                //alert('ha figli');

                var m_childs = $("#" + m_selectedId + " li");

                if (m_childs.length > 0) {
                    m_pages.push(m_selectedId);

                    $.each(m_childs, function (index, value) {
                        m_pages.push(value.id);
                    });
                } else {
                    m_pages.push(m_selectedId);
                }
            }

            if ($("#" + m_selectedId).parents('ul').length > 0) {

                var m_parents = $("#" + m_selectedId).parents('ul');

                $.each(m_parents, function (index, value) {
                    if (value.id != 'MasterRoot') {
                        m_pages.push(value.id);
                    }
                });
            }

            var m_items = $.map($('#sortable2 li'), function (element) { return $(element).text() }); //.join(',');

            var data = JSON.stringify({ PageIds: m_pages, Roles: m_items })

            //{ '': m_items }
            //$.post('/api/authentication/UpdateAssignedRoles', data).done(function (result) {

            //    if (result) {
            //        alert('Salvataggio configurazione effettuato !');
            //    } else {
            //        alert('Salvataggio configurazione fallito !');
            //    }

            //    m_selectedId = null;
            //});



            $.ajax({
                type: "POST",
                url: '/api/authentication/UpdateAssignedRoles',
                data: data,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    var data = JSON.parse(response);

                    if (data.d) {
                        alert(data.msg);
                    } else {
                        alert(data.msg);
                    }
                },
                failure: function (response) {
                    alert(response.message);
                }
            });
        }
    </script>
</asp:Content>
